import SwiftUI

struct QA1: View {
    var body: some View {
        NavigationStack {
            VStack {
                Divider()
                    .background(
                        LinearGradient(colors: [.green, .blue, .purple],
                                       startPoint: .topLeading,
                                       endPoint: .bottomTrailing)
                    )
                Spacer()
                List{
                    Section {
                        ListRowItem(icon: "doc.plaintext", label: "Content View")
                        ListRowItem(icon: "doc.viewfinder", label: "Template View")
                        ListRowItem(icon: "square.stack.3d.forward.dottedline", label: "HStack View")
                        NavigationLink {
                            VStackView()
                        } label: {
                            ListRowItem(icon:"square.stack.3d.up.fill", label: "VStack View")
                        }
                    } header: {
                        Text("UI Layouts").foregroundColor(.green).font(.headline)
                    }footer: {
                        Text("Counter: 4").font(.headline).foregroundColor(.pink)
                    }
                    Section {
                        ListRowItem1(icon: "button.programmable", label: "Introduction")
                    } header: {
                        Text("Button").foregroundColor(.orange).font(.headline)
                    }
                }
                .listStyle(.automatic)
                Spacer()
            }
            .navigationTitle("View catalog")
            .navigationBarTitleDisplayMode(.inline)
        }
    }
}

struct ListRowItem1: View {
    let icon: String
    let label: String
    var body: some View {
        HStack {
            Image (systemName: icon)
            Text(label)
        }
        .font(.title3)
        .padding()
    }
}
